// Font families

$font-family-1: "OpenSans", sans-serif;
$font-family-2: "Farro", sans-serif;
$font-family-3: "Heebo", sans-serif;
$font-family-4: "Inter", sans-serif;
$font-family-5: "Source Sans Pro", sans-serif;
$font-family-6: "Bebas Neue", sans-serif;

//colors
$theme-color-1: #57b6fa;
$dark-background-1: rgb(94, 93, 93);
$dark-background-2: rgb(48, 48, 48);
$light-background-1: rgb(253, 252, 252);
$light-background-2: rgba(243, 239, 239, 0.616);
$hover-background-2: rgba(243, 239, 239, 0.164);
$dark-heading-1: rgb(78, 78, 78);
$text-area-color-dark: rgb(100, 100, 100);
$text-area-backgroundColor-light: rgb(243, 242, 242);
$hover-backgroundColor: rgba(117, 117, 117, 0.26);
$warning-red: red;

//scrollbar
$scrollbar-color-light: rgb(236, 236, 236);
$scrollbar-color-dark: #bbb9b9;

//navbar
$navbar-background-color: #363636;
$navbar-brand-color: rgb(14, 145, 14);
$navbar-color-light: #e0e0e0f3;
$navbar-color-dark: #302f2f;

//button
$button-color-dark: #666666;
$button-color-light: #f0f0f0;
$button-backgroundColor-1: #1882ce;
$button-backgroundColor-2: #2faff8;
$button-backgroundColor-3: #0d96e6;
$button-backgroundColor-4: #ff6d6d;
$button-backgroundColor-5: #f85252;
$button-backgroundColor-6: #6dd84a;
$button-backgroundColor-7: #58c458;
$hover-dark: rgb(230, 230, 230);

//modal
$modal-background-color: rgba(8, 8, 8, 0.795);
$modal-color-dark: rgb(58, 58, 58);

//screen sizes

// small smartphones
$screen-xs-max: 360px;

// Small tablets and large smartphones
$screen-sm-max: 576px;

// Small tablets
$screen-md-max: 768px;

// Tablets and small desktops
$screen-lg-max: 992px;

// Large tablets and desktops
$screen-xl-max: 1200px;
